<template>
<div class="show">
  <Header><span slot="back" class="back" @click="goback" >返回</span>
    <span slot="home" class="home" @click="gohome">首页</span></Header>
    <van-address-list
  v-model="chosenAddressId"
  :list="list"
  :disabled-list="disabledList"
  disabled-text="以下地址超出配送范围"
  default-tag-text="默认"
  @add="onAdd"
  @edit="onEdit"
  @click-item="clickaddress"
  @select="selectDefault"
> 
<van-button  type="info" class="confirm" @click="Onconfirm">确认地址</van-button>
</van-address-list>



</div>
</template>
<script>

import Header from "../../components/HeaderPublic";
import Button from "../../components/Button1.vue";
import { Toast } from "vant";
import {reqshowAddress,reqSubmitorder} from "../../api/reqshowaddress";
import {reqEditaddress} from "../../api/reqaddress";
export default {
data() {
return {
    chosenAddressId: '1',
      list: [],
      disabledList: [],
      id:"",
      address_id:"",//传给购物车的选择地址id
    };
},
computed: {},
watch: {},
methods: {
  async initaddress(){
    const result = await reqshowAddress();

    result.addresses.forEach(item => {
      let {_id,receiver,mobile,regions,address,isDefault} = item;
      this.list.push({
        id:_id,
        name: receiver,
        tel: mobile,
        address: regions + address,
        isDefault: isDefault,
        ssq:regions,
        xxdz:address
      });
    });

    // this.list[0].isDefault=true;
    // this.chosenAddressId = this.list[0].id;

  },
    onAdd() {
      // Toast('新增地址');
      this.$router.push("/address");
    },
    onEdit(item, index) {
      // Toast('编辑地址:' + index);
      this.id = this.list[index].id;
      this.$router.push("/editaddress/"+this.id);
    },
    //	点击任意地址时触发
    async clickaddress(item,index){
      // console.log(item);
      /* console.log(this.$store.state.showaddress.paygoods);
      if(this.$store.state.showaddress.paygoods.length == 0){
        Toast('如购买商品请先选择商品');
        // this.$router.push("/cart");
      }else{
        const result = await reqSubmitorder({
          receiver:item.name,
          regions:item.ssq,
          address:item.xxdz,
          orderDetails:this.$store.state.showaddress.paygoods
        }); 
        console.log(result);
        this.$store.state.showaddress.paygoods = [];
      } */
      /*  */
    },
    goback(){
        this.$router.back();
    },
    gohome(){
        this.$router.push("/home");
    },
    //封装接口
    async updateaddress(id,name,tel,ssq,xxdz,defaults){
    const result =  await reqEditaddress(id,{
                 receiver:name,
                 mobile:tel,
                 regions:ssq,
                 address:xxdz,
                 isDefault:defaults,
           });

    },
    //当切换选中的地址时触发
     selectDefault(item,index){

      //设置默认地址
      item.isDefault = true;

      this.updateaddress(item.id,item.name,item.tel,item.ssq,item.xxdz,true);

      //取消其它默认
      this.list.filter((element,indexs)=>{return indexs!=index;}).forEach((items)=>{
 
        
        if(items.isDefault=true){
          items.isDefault=false; 
           this.updateaddress(items.id,items.name,items.tel,items.ssq,items.xxdz,false);
          //  console.log(22);
        }
        }); 
      this.address_id = item.id;//给address_id传地址id

    },
    Onconfirm() {
      // this.$router.push(-1);
    },
},
created() {
  this.initaddress();
},
mounted() {},
components: {
  Header,
  Button,
},
};
</script>
<style scoped>
.confirm {
  /* margin-top: 38%; */
  top: 60px;
  left: 50%;
  width: 97%;
  transform: translate(-50%, -50%);
  border-radius: 999px;
}
</style>